import QtQuick
import QtQuick.Controls
import Qt.labs.qmlmodels

Rectangle {
    width: 400
    height: 300
    color: "#f0f0f0"

    TableModel {
        id: tableModel
        TableModelColumn { display: "name" }
        TableModelColumn { display: "age" }
        TableModelColumn { display: "occupation" }

        rows: [
            {
                name: "张三",
                age: "25",
                occupation: "工程师"
            },
            {
                name: "李四",
                age: "30",
                occupation: "设计师"
            },
            {
                name: "王五",
                age: "28",
                occupation: "产品经理"
            },
            {
                name: "赵六",
                age: "35",
                occupation: "销售经理"
            }
        ]
    }

    TableView {
        anchors.fill: parent
        anchors.margins: 10
        clip: true
        model: tableModel
        columnSpacing: 1
        rowSpacing: 1

        delegate: Rectangle {
            implicitWidth: 120
            implicitHeight: 40
            border.width: 1
            border.color: "#dddddd"
            color: "#ffffff"

            Text {
                anchors.centerIn: parent
                text: display
            }
        }

        columnWidthProvider: function(column) { 
            if (column < 3) return 120
            return 0
        }
        rowHeightProvider: function(row) { return 40 }
    }
} 